<template>
  <view>
    <view class="form_active_title">“简单的自我介绍给企业留个好印象”</view>
    <u-field
	placeholder-style="color:#757575;font-size:14px !important;" 
      required
      v-model="basic.fullname"
      label="姓名"
      placeholder="请填写"
      class="reset_after"
    />
	<view class="sexRadioBox">
		<u-field required class="reset_after" label="性别">
			<u-radio-group slot="right" v-model="basic.sex" direction="horizontal" icon-size="28rpx" >
			  <u-radio name="1">男</u-radio>
			  <u-radio name="2">女</u-radio>
			</u-radio-group>
		</u-field>
	</view>
   
   <view class="form-line u-border-bottom" @click="showPickerBirthday = !showPickerBirthday">
	<view class="form-field">
		<view class="label">
			出生日期
		</view>
		<view :class="basic.birthday ? 'text' : 'text ac'">
			{{basic.birthday ? basic.birthday : '点击选择出生日期'}}
		</view>
	</view>
	<u-icon class="arrow-icon" name="arrow-right"></u-icon>
   </view>
    
	  <u-picker
		v-model="showPickerBirthday"
		mode='time'
		title="选择出生日期"
		:start-year="minDate"
		:end-year="maxBirthdayDate"
		:default-time="defaultBirthdayDate"
		:params="birthdayDateParams"
		@confirm="onConfirmBirthday"
		@cancel="showPickerBirthday = false"
	  />
	  
	<view class="form-line u-border-bottom" @click="showPickerEdu = !showPickerEdu">
		<view class="form-field">
			<view class="label">
				最高学历
			</view>
			<view :class="basic.educationName ? 'text' : 'text ac'">
				{{basic.educationName ? basic.educationName : '点击选择学历'}}
			</view>
		</view>
		<u-icon class="arrow-icon" name="arrow-right"></u-icon>
	</view>
    
    <u-picker v-model="showPickerEdu" mode="selector" :range="columnsEdu" range-key="text" @confirm="onConfirmEducation" @cancel="showPickerEdu = false" />
    <u-field
	placeholder-style="color:#757575;font-size:14px !important;" 
      required
      v-model="contact.mobile"
      label="联系电话"
      placeholder="请填写联系电话"
      class="reset_after"
      @input="hanlderMobile"
    />
    <!-- <u-field
      required
      v-model="contact.weixin"
      label="联系微信"
      placeholder="请填写联系微信"
      class="reset_after"
      @input="hanlderWeixin"
    /> -->
    <view style="margin: 32rpx; position: relative">
      <u-button type="primary" shape="circle" @click="handleSubmit">
        下一步
      </u-button>
      <!-- <view class="sync_phone">
        <u-checkbox v-model="checkedEditPhone" icon-size="32rpx" @change="handlerSync">同手机号</u-checkbox>
      </view> -->
    </view>
	<u-top-tips ref="uTips"></u-top-tips>
  </view>
</template>

<script>
import http from '@/utils/http'
import api from '@/api'
export default {
  name: 'RegIntStep1',
  onReady(){
	  this.defaultBirthdayDate = (new Date().getFullYear() - 16) + '-' + (new Date().getMonth() +1)
  },
  created () {
	this.initDate()
    this.$store.dispatch('getClassify', 'education')
    this.contact.mobile = this.$store.state.userMobile
    this.contact.weixin = this.$store.state.userMobile
  },
  computed: {
    columnsEdu () {
      return this.$store.state.classifyEdu
    }
  },
  data () {
    return {
	  defaultBirthdayDate:'',
	  birthdayDateParams:{
		year: true,
		month: true,
		day: false,
		hour: false,
		minute: false,
		second: false
	  },
      currentDateEnterJob: '',
      minDate: '',
      maxDate: '',
      maxBirthdayDate: '',
      checkedEditPhone: true,
      showPickerBirthday: false,
      showPickerEdu: false,
      basic: {
        fullname: '',
        sex: '1',
        birthday: '',
        education: '',
        educationName: ''
      },
      contact: {
        mobile: '',
        weixin: ''
      }
    }
  },
  methods: {
    hanlderMobile () {
      if (this.contact.weixin !== this.contact.mobile) {
        this.checkedEditPhone = false
      } else {
        this.checkedEditPhone = true
      }
    },
    hanlderWeixin () {
      if (this.contact.weixin !== this.contact.mobile) {
        this.checkedEditPhone = false
      } else {
        this.checkedEditPhone = true
      }
    },
    handlerSync () {
      if (!this.checkedEditPhone) {
        this.contact.weixin = this.contact.mobile
      }
    },
    // 设置日期插件默认值
    initDate () {
      let nowDate = new Date()
      let nowYear = nowDate.getFullYear()
      this.minDate = nowYear - 59
	  this.maxBirthdayDate =nowYear - 16
      this.maxDate = nowDate
      this.currentDateEnterJob = nowDate
    },
    onConfirmBirthday (value) {
	  let {year,month} = value
      this.basic.birthday = year+'-'+month
      this.showPickerBirthday = !this.showPickerBirthday
    },
    onConfirmEducation (value) {
	  let [index] = value
      this.basic.education = this.columnsEdu[index].id
      this.basic.educationName = this.columnsEdu[index].text
      this.showPickerEdu = !this.showPickerEdu
    },
    dateFormat (time) {
      let year = time.getFullYear()
      let month = time.getMonth() + 1
      return `${year}-${month}`
    },
    handleSubmit () {
      if (!this.basic.fullname) {
		this.$refs.uTips.show({
			title: '请填写姓名',
			type: 'error'
		})
        return false
      }
      if (!this.basic.sex) {
		this.$refs.uTips.show({
			title: '请选择性别',
			type: 'error'
		})
        return false
      }
      if (!this.basic.birthday) {
		this.$refs.uTips.show({
			title: '请选择出生年份',
			type: 'error'
		})
        return false
      }
      if (!this.basic.education) {
		this.$refs.uTips.show({
			title: '请选择最高学历',
			type: 'error'
		})
        return false
      }
      if (!this.contact.mobile) {
		this.$refs.uTips.show({
			title: '请填写联系电话',
			type: 'error'
		})
        return false
      }
  //     if (!this.contact.weixin) {
		// this.$refs.uTips.show({
		// 	title: '请填写联系微信',
		// 	type: 'error'
		// })
  //       return false
  //     }
      http.post(api.reg_resume_int_step1, {
        basic: {
          fullname: this.basic.fullname,
          sex: this.basic.sex,
          birthday: this.basic.birthday,
          education: this.basic.education
        },
        contact: {
          mobile: this.contact.mobile,
          weixin: this.contact.weixin
        }
      })
        .then(res => {
          uni.navigateTo({
          	url:'/personal/AddResumeByInteractive/RegIntStep2'
          })
        })
        .catch(err => {
          console.log(err)
        })
    }
  }
}
</script>

<style lang="scss" scoped>
.edit_phone {
  position: absolute;
  right: 0;
  top: -232rpx;
  font-size: 28rpx;
  color: #2199ff;
  padding: 26rpx 0;
  line-height: 48rpx;
}
.sync_phone {
  position: absolute;
  right: 0;
  top: -132rpx;
  font-size: 28rpx;
  color: #515151;
  padding: 26rpx 0;
  line-height: 48rpx;
  z-index: 5;
}
.sexRadioBox{
	/deep/ .fild-body{
		/deep/ .u-flex{
			flex: 0;
		}
	}
}
</style>
